<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta charset="utf-8" />
		<title>编辑文章</title>
	<style type="text/css">
		.toolbar {
			border: 1px solid #ccc;
		}
		.text {
			border: 1px solid #ccc;
			height: 400px;
		}

		table {
			border-top: 1px solid #ccc;
			border-left: 1px solid #ccc;
		}
		table td,
		table th {
			border-bottom: 1px solid #ccc;
			border-right: 1px solid #ccc;
			padding: 3px 5px;
		}
		table th {
			border-bottom: 2px solid #ccc;
			text-align: center;
		}

		/* blockquote 样式 */
		blockquote {
			display: block;
			border-left: 8px solid #d0e5f2;
			padding: 5px 10px;
			margin: 10px 0;
			line-height: 1.4;
			font-size: 100%;
			background-color: #f1f1f1;
		}

		/* code 样式 */
		code {
			display: inline-block;
			*display: inline;
			*zoom: 1;
			background-color: #f1f1f1;
			border-radius: 3px;
			padding: 3px 5px;
			margin: 0 3px;
		}
		pre code {
			display: block;
		}

		/* ul ol 样式 */
		ul, ol {
			margin: 10px 0 10px 20px;
		}
	</style>
</head>
<body>



<div id="div1" class="toolbar">
</div>
<div style="padding: 5px 0; color: #ccc">中间隔离带</div>
<div id="div2" class="text"> <!--可使用 min-height 实现编辑区域自动增加高度-->
	<p>请输入内容</p>
</div>

<button id="btn1">获取html</button>
<button id="btn2">获取text</button>

	<!-- 注意， 只需要引用 JS，无需引用任何 CSS ！！！-->
	<script type="text/javascript" src="../wangEditor/wangEditor.js"></script>
<script type="text/javascript">
    var E = window.wangEditor
    var editor1 = new E('#div1', '#div2')  // 两个参数也可以传入 elem 对象，class 选择器
    editor1.create();
    document.getElementById('btn1').addEventListener('click', function () {
        // 读取 html
        alert(editor1.txt.html())
    }, false)

    document.getElementById('btn2').addEventListener('click', function () {
        // 读取 text
        alert(editor1.txt.text())
    }, false)

</script>

<br>
<!--获取后台四位验证码-->
<div  align="center">
	<img src="/images/imagecode" style="height: 60px;width: 100px;"/>
</div>
	</body>

</html>